<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <title>逾期列表</title>
    <%@ include file="/WEB-INF/views/modules/commons/head.jsp" %>
    <!-- 组件的css -->
    <link rel="stylesheet" href="<s:url value="/assets/web/common/lulu_zujian/ui.css"></s:url>">
    <!-- 用户管理 CSS -->
    <link rel="stylesheet" href="<s:url value="/assets/web/css/user/userManger.css"></s:url>">
    <style>
        /* 公用边距 */
        #content-main {
            padding: 0 20px 0;
        }

        .click-operation {
            color: #337ab7;
            cursor: pointer;
        }

        /* 多余部分隐藏点点点 */
        .hidden-font {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .rf {
            float: right;
        }

        .lf {
            float: left;
        }

        .clear:after {
            content: '';
            clear: both;
            display: block;
        }

        #warning-list .clear > span {
            display: inline-block;
            width: 200px;
        }

        #warning-list .clear > span:first-child {
            text-align: left;
        }

        #warning-list .clear > span:last-child {
            text-align: left;
        }

        .containers {
            margin-top: 15px;
            margin-bottom: 15px;
            margin-left: 70px;
        }

        .containers input {
            width: 120px;
            height: 35px;
            margin-right: 10px;
        }

        .containers select {
            width: 80px;
            height: 35px;
            margin-right: 10px;
            opacity: 1;
            border-right-width: 0px;
        }

        .containers button {
            background: #33CCFF;
            border: none;
            width: 50px;
            height: 35px;
            border-radius: 5px;
            color: #fff;
        }

        .index-charts {
            margin-top: 15px;
        }

        .username-right .dropdown-menu {
            margin-top: 33px;
        }

        .lefts {
            text-align: left !important;
        }

        .hidden{
            display: none;
        }

    </style>
</head>
<body class="bgcolor">
<%@ include file="/WEB-INF/views/modules/commons/nav.jsp" %>
<%@ include file="/WEB-INF/views/modules/commons/menu.jsp" %>
<table></table>
<%--上传成功模态框--%>
<div class="shade" style="display: none;"></div>
<div class="warning" style="display: none;">
    <p class="title"><em></em><span class="close">X</span></p>
    <p class="cont"></p>
    <div class="la-square-jelly-box la-3x">
        <div></div>
        <div></div>
    </div>
</div>
<div class="av row J_mainContent" id="content-main">
    <div class="user-manger">
        <div class="containers" style="position: relative;">
            <div class="search-project">
                项目名:<input type="text" id="projectName">
                责任单位:<input type="text" id="resDept">
                经办人:<input type="text" id="operatorUser">
                状态:<select id="state">
                <option value="">请选择</option>
                <option value="0">未处理</option>
                <option value="1">已处理</option>
            </select>
                起止范围：<input type="text" id="J-xl-1" placeholder="请输入开始时间">-
                <input type="text" id="J-xl-2" placeholder="请输入结束时间">
                <input type="hidden" id="pages">
                <button class="search-btn" id="queryData">搜索</button>
                <button class="search-btn" id="resetData">重置</button>
            </div>

        </div>

        <div class="container">
            <table class="project-info">
                <thead>
                <tr>
                    <th>项目名称</th>
                    <th style="color: red">逾期天数</th>
                    <th>节点名称</th>
                    <%--<th>责任单位</th>--%>
                    <%--<th>经办人</th>--%>
                    <th>逾期日期</th>
                    <%--<th>操作</th>--%>
                </tr>
                </thead>
                <tbody id="main">

                </tbody>
            </table>
        </div>

        <div class="footer">
            <ul class="pagination" id="pagination0"></ul>
        </div>

        <%--<div class="shade"></div>--%>
    </div>
</div>
<%--操作模态框--%>
<div class="modal fade" id="myModal-1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
     data-backdrop="static">
    <div class="modal-dialog">
        <div class="modal-content">
            <%--form 表单--%>
            <form name="form1" method="post" action="/warningManger/updateEarlyWarning" onsubmit="return false;">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">逾期列表处理</h4>
                </div>
                <div id="warning-list" class="modal-body text-center">
                    <p class="clear">
                      <span class="lf hidden-font" title="海洋极地时间">
                          项目名称&nbsp;：<em>海洋极地时间</em>
                      </span>
                        <span class="rf hidden-font" title="">
                          项目节点&nbsp;：<em>1.1备案</em>
                      </span>
                    </p>
                    <p class="clear">
                      <span class="lf hidden-font">
                          责任人&nbsp;：<em>邓永明</em>
                      </span>
                        <span class="rf hidden-font" title="业主单位">
                          责任单位：<em>业主单位</em>
                      </span>
                    </p>

                    <p class="clear">
                      <span class="lf hidden-font">
                          联系电话：<em>1825929331</em>
                      </span>
                        <span class="rf hidden-font">
                          经办人：<em>李元芳</em>
                      </span>
                    </p>

                    <p class="clear">
                      <span class="lf hidden-font">
                          联系电话：<em>1825929331</em>
                      </span>
                        <span class="rf hidden-font">
                          节点状态：<em>已经开始</em>
                      </span>
                    </p>

                    <p class="clear">
                      <span class="lf hidden-font">
                          计划用时：<em>0 天</em>
                      </span>
                        <span class="rf hidden-font">
                          实际开始：<em>0</em>
                      </span>
                    </p>

                    <p class="clear">
                      <span class="lf hidden-font">
                          实际结束：<em>0 天</em>
                      </span>
                        <span class="rf hidden-font">
                          实际用时：<em>0</em>
                      </span>
                    </p>
                    <input type="hidden" name="sysId" id="sysId" value=""/>
                    <c:if test="${user.branchType== '0' || user.branchType== '1'}">
                        <div class="lefts">
                            <div>我要反馈(逾期原因)：</div>
                            <div>
                                <textarea name="content" id="delay-reason" cols="60" rows="2"
                                          style="resize:none;"></textarea>
                            </div>
                        </div>
                    </c:if>
                    <c:if test="${user.branchType== '2'||user.branchType== '4'}">
                        <div class="lefts">
                            <div>
                                逾期原因：
                            </div>
                            <div>
                                <textarea id="delay-reason" cols="60" rows="2" style="resize:none;"
                                          disabled="disabled"></textarea>
                            </div>
                        </div>
                        <div class="lefts">
                            <div>处理意见：</div>
                            <div>
                                <textarea name="opinions" id="advice-reson" cols="60" rows="2"
                                          style="resize:none;"></textarea>
                            </div>
                        </div>
                    </c:if>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="submit" class="btn btn-primary">确定提交</button>
                </div>
            </form>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<%@ include file="/WEB-INF/views/modules/commons/foot.jsp" %>
<%--上传js--%>
<script src="<s:url value="/assets/js/ajaxfileupload.js"></s:url>"></script>
<script src="<s:url value="/assets/web/common/date/laydate.dev.js"></s:url>"></script>
<script>
    $(function () {
        laydate({
            elem: '#J-xl-1',
        });
        laydate({
            elem: '#J-xl-2',
        });
    });

    /**
     * 点击事件获取到参数并赋值到模态框
     */
    function query(id) {
        var filter = {"sysId": id};

        $.ajax({
            url: "/warningManger/queryEarlyWarning",
            type: "POST",
            dataType: "json",
            contentType: "application/json",
            // data : {"sysId" : id},
            data: JSON.stringify(filter),
            // 成功后开启模态框
            success: showQuery,
            error: function () {
                alert("请求失败");
            },

        });
    }

    // 查询成功后向模态框插入数据并开启模态框。data是返回的JSON对象
    function showQuery(data) {
        console.log(data)
        $("#warning-list>p:nth-child(1)>span:first-child>em").text(data.projectName);
        $("#warning-list>p:nth-child(1)>span:last-child>em").text(data.nodeId + data.nodeName);

        $("#warning-list>p:nth-child(2)>span:first-child>em").text(data.resUser);
        $("#warning-list>p:nth-child(2)>span:last-child>em").text(data.resDept);

        $("#warning-list>p:nth-child(3)>span:first-child>em").text(data.resUserPhone);
        $("#warning-list>p:nth-child(3)>span:last-child>em").text(data.operatorUser);

        $("#warning-list>p:nth-child(4)>span:first-child>em").text(data.operatorPhone);
        if (data.status == 0) {
            $("#warning-list>p:nth-child(4)>span:last-child>em").text("未开始");
        } else if (data.status == 1) {
            $("#warning-list>p:nth-child(4)>span:last-child>em").text("进行中");
        } else if (data.status == 2) {
            $("#warning-list>p:nth-child(4)>span:last-child>em").text("已结束");
        }

        $("#sysId").val(data.sysId);
        $("#warning-list>p:nth-child(5)>span:first-child>em").text(data.planTime);
        $("#warning-list>p:nth-child(5)>span:last-child>em").text(data.planBeginDate);

        $("#warning-list>p:nth-child(6)>span:first-child>em").text(data.factFinishDate);
        $("#warning-list>p:nth-child(6)>span:last-child>em").text(data.factTime);
        $("#delay-reason").val(data.content);
        $("#advice-reson").val(data.opinions);
        $('#myModal-1').modal('show');

    }

    $(function () {
        <%--分页请求--%>
        var pages = $('#pagination0').jqPaginator({
            totalPages: ${totalPage},
            visiblePages: 5,
            currentPage: 1,
            first: '<li class="first"><a href="javascript:void(0);">首页</a></li>',
            prev: '<li class="prev"><a href="javascript:void(0);">上一页</a></li>',
            next: '<li class="next"><a href="javascript:void(0);">下一页</a></li>',
            last: '<li class="last"><a href="javascript:void(0);">末页</a></li>',
            page: '<li class="page"><a href="javascript:void(0);">{{page}}</a></li>',
            onPageChange: function (num) {
                $('#text').html('当前第' + num + '页');
                $.ajax({
                    type: "POST",
                    url: "/warningManger/go/lists",
                    dataType: "json",
                    data: ({"page": num}),
                    success: function (model) {
                        console.log(model);
                        var html = "";
                        for (var i = 0; i < model.model.length; i++) {
                            var list = model.model[i];
                            var name = "我要反馈";
                            if (list.state == 1) {
                                name = "已反馈";
                            }
                            html += '\
                                <tr class ="+i+">\
                                    <td>' + list.projectName + '</td>\
                                    <td style="color: red">' + list.number + '</td>\
                                    <td>' + list.nodeId + list.nodeName + '</td>\
                                    <td class="hidden">' + list.resDept + '</td>\
                                    <td class="hidden">' + list.operatorUser + '</td>\
                                    <td>' + list.createDate + '</td>\
                                    <td class="hidden"><a href="javascript:void(0);"  onclick=\'query("' + list.sysId + '")\'>' + name + '</a></td>\
                                </tr>';
                        }
                        $("#main").html(html);
                        $("#page").html(num);
                        //赋值总页数
                        $("#pages").val(model.totalPage);
                        pagg = Number($("#pages").val());
                        //调用分页插件修改查询总页数
                        $('#pagination0').jqPaginator('option', {
                            totalPages: pagg,
                        });
                    },
                    error: function (model) {

                    }
                })
            }

        });

    })
    $("#queryData").click(function () {
        $('#pagination0').jqPaginator({
            totalPages: 1,
            visiblePages: 5,
            currentPage: 1,
            first: '<li class="first"><a href="javascript:void(0);">首页</a></li>',
            prev: '<li class="prev"><a href="javascript:void(0);">上一页</a></li>',
            next: '<li class="next"><a href="javascript:void(0);">下一页</a></li>',
            last: '<li class="last"><a href="javascript:void(0);">末页</a></li>',
            page: '<li class="page"><a href="javascript:void(0);">{{page}}</a></li>',
            onPageChange: function (num) {
                $('#text').html('当前第' + num + '页');
                var projectName = $("#projectName").val();
                var resDept = $("#resDept").val();
                var operatorUser = $("#operatorUser").val();
                var state = $("#state").val();
                var startTime = $("#J-xl-1").val();
                var endTime = $("#J-xl-2").val();
                $.ajax({
                    type: "POST",
                    url: "/warningManger/go/lists",
                    dataType: "json",
                    data: ({
                        "page": num,
                        "projectName": projectName,
                        "resDept": resDept,
                        "operatorUser": operatorUser,
                        "state": state,
                        "startTime": startTime,
                        "endTime": endTime
                    }),
                    success: function (model) {
                        console.log(model);
                        var html = "";
                        for (var i = 0; i < model.model.length; i++) {
                            var list = model.model[i];
                            var name = "点击处理";
                            if (list.state == 1) {
                                name = "已处理";
                            }
                            html += '\
                                <tr class ="+i+">\
                                    <td>' + list.projectName + '</td>\
                                    <td>' + list.nodeId + list.nodeName + '</td>\
                                    <td class="hidden">' + list.resDept + '</td>\
                                    <td class="hidden">' + list.operatorUser + '</td>\
                                    <td>' + list.number + '</td>\
                                    <td>' + list.createDate + '</td>\
                                     <td><a href="javascript:void(0);"  onclick=\'query("' + list.sysId + '")\'>' + name + '</a></td>\
                                </tr>';
                        }
                        $("#main").html(html);
                        $("#page").html(num);
                        //赋值总页数
                        $("#pages").val(model.totalPage);
                        pagg = Number($("#pages").val());
                        //调用分页插件修改查询总页数
                        $('#pagination0').jqPaginator('option', {
                            totalPages: pagg,
                        });
                    },
                    error: function (model) {

                    }
                })
            }

        });
    });

    //上传材料
    $("#btn-upload").click(function () {
        var fileval = $("#fileupload").val();
        if (fileval == null || fileval == "") {
            alert("未选择任何文件");
            return;
        }

       /* $(".shade").fadeIn(100);
        $(".warning").fadeIn(100);
        $('.la-square-jelly-box').show();
        showShade();*/
        //警告框自定义内容
        $('.warning>.title>em').html('加载中……');
        $.ajaxFileUpload({
            type: "post",
            fileElementId: "fileupload",
            secureuri: false,
            dataType: 'text',
            url: "/communal/uploadBatch",
            // data:fileinfo,
            async: false,
            success: function (data) {
                var data = JSON.parse(data);
                console.log(data);
                var val = data.data.sysid;
                console.log(val);
                $("#taxproof_proof").attr("value", val);
                if (data.code === "200") {
                    $('.warning>.title>em').html('上传成功');
                } else {
                    $('.warning>.title>em').html('上传失败');
                }
            },
            error: function (data) {
                /*$("#dialog").dialog("close");*/

                alert("佐证材料上传失败 ！！请联系管理员");
            }

        });

    });


    $("#resetData").click(function () {
        $("#projectName").val("");
        $("#resDept").val("");
        $("#operatorUser").val("");
        $("#state").val("");
        $("#J-xl-1").val("");
        $("#J-xl-2").val("");

    });

    // $(".nav li:last-child").prev().remove();//移出空元素
    // $(".nav li:last-child").addClass("active");//导航栏添加颜色状态
</script>
</body>
</html>
